<template>
	<view>
		<view>
			<navitop>
				<i class="iconfont icon-jiantou-copy" slot="left-slot" @click="previous_page"></i>
				<span slot="center-slot"><h4>{{title}}</h4></span>
				<i  slot="right-slot" class="iconfont icon-youcecaidan" @click="library_click" v-if="notif"></i>
			</navitop> 
		</view>
		<view :style="'padding-top:' + nv_height">
			<view class="library_details">
				<div class="library_list"> 
					<div class="library_list_top">
						<h5>基本信息</h5>
					</div>
					<div class="library_list_nav">
						<div class="library_list_left">
							单据编号：
						</div>
						<div class="library_list_right"> 
						{{dataSorce.voucherCode}}
						</div>
					</div>
					<div class="library_list_nav">
						<div class="library_list_left">
							单据时间：
						</div>
						<div class="library_list_right"> 
						{{dataSorce.createDate}}
						</div>
					</div>
					<div class="library_list_nav">
						<div class="library_list_left">
							盘点方式：
						</div>
						<div class="library_list_right"> 
						{{dataSorce.checkWay == '1' ? '全盘' : '抽盘'}}
						</div>
					</div>
					<div class="library_list_nav">
						<div class="library_list_left">
							审核人：
						</div>
						<div class="library_list_right"> 
							{{dataSorce.reviewerUserName}}
						</div>
					</div>
					<div class="library_list_nav">
						<div class="library_list_left">
							监督人：
						</div>
						<div class="library_list_right"> 
						{{dataSorce.superviseUserName}}
						</div>
					</div>
					<div class="library_list_nav">
						<div class="library_list_left">
							仓库：
						</div>
						<div class="library_list_right"> 
						{{dataSorce.warehouseName}}
						</div>
					</div>
					<div class="library_list_nav">
						<div class="library_list_left">
							状态：
						</div>
						<div class="library_list_right"> 
							{{dataSorce.voucherState == '3' ? '已批准' : dataSorce.voucherState == '1' ? '已复核' : dataSorce.voucherState == '2' ? '已监盘' :  dataSorce.voucherState == '0' ? '未复核' : '其他'}}
						</div>
					</div>
				</div>
			</view>
			<!-- 入库物品 -->
			<view class="library_details">
				<div class="library_list"> 
					<div class="library_list_top">
						<h5>物料列表</h5>
					</div>
					<div class="library_commodity" v-for="(item,index) in dataSorce.orderDetailList">
						<div class="library_commodity_center">
							<div>
								物料编码：
							</div>
							<div>
								{{item.inventoryCode}}
							</div>
						</div>
						<div class="library_commodity_center">
							<div>
								物料名称：
							</div>
							<div>
								{{item.inventoryName}}
							</div>
						</div>
						<div class="library_commodity_center">
							<div>
								规格型号：
							</div>
							<div>
								{{item.inventorySpecification}}
							</div>
						</div>
						<div class="library_commodity_center">
							<div>
								盘点数量：
							</div>
							<div>
								{{item.checkQuantity}}
							</div>
						</div>
						<div class="library_commodity_center">
							<div>
								单价：
							</div>
							<div>
								{{item.price}}
							</div>
						</div>
						<div class="library_commodity_center">
							<div>
								盘点金额：
							</div>
							<div>
								{{item.checkAmount}}
							</div>
						</div>
						<div class="library_commodity_center">
							<div>
								账面数量：
							</div>
							<div>
								{{item.baseQuantity}}
							</div>
						</div>
						<div class="library_commodity_center">
							<div>
								盘点数量：
							</div>
							<div>
								{{item.checkQuantity}}
							</div>
						</div>
						<div class="library_commodity_center">
							<div>
								盈亏数量：
							</div>
							<div>
								{{item.lossOrGainQuantity}}
							</div>
						</div> 
						<div class="library_commodity_center">
							<div>
								盈亏比例(%):
							</div>
							<div>
								{{item.lossOrGainRate}}
							</div>
						</div>
						
					</div>
				</div>
			</view>
		</view>
	
		<!-- 气泡弹窗 -->
		 <chunLei-popups v-model="value" :popData="datas" @tapPopup="bubble" :x="345" :y="95" placement="top-end">
		 </chunLei-popups>
	</view>
</template>

<script>

import navitop from '@/components/common/navi-top'	
import {getCondition,firstExamine,secondExamine,inventorydelete} from "@/common/api/job/sale.js"
import chunLeiPopups from "@/components/chunLei-popups/chunLei-popups";
export default {
	components:{
		navitop,
		chunLeiPopups
	},
	data(){
		return {
			nv_height: '',
			title: '详情列表',
			curl_data: '',
			dataSorce: [],
			value: false,
			notif: true,
			datas: [
				{title:'修改',code:'Inventoryedit',icon:'icon-bianji'},
				{title:'复核',code:'Inventoryfh',icon:'icon-bianji'},
				{title:'取消复核',code:'Inventoryqxfh',icon:'icon-bianji'},
				{title:'监盘',code:'Inventoryjp',icon:'icon-bianji'},
				{title:'取消监盘',code:'Inventoryqxjp',icon:'icon-bianji'},
				{title:'删除',code:'Inventorydel',icon:'icon-bianji'}
			],
		}
	},
	onLoad(option) {
		this.getCondition = option
		
		if(option.somvo == 1){
			this.notif = false;
		}
	},
	mounted() {
		 this.nv_height = uni.getSystemInfoSync().statusBarHeight + 65 + 'px';
		 
		 this.get_list_dataSorce();
	},
	methods: {
		
		// 返回
		previous_page(){
			uni.navigateTo({
				url: '/pages/common/index/purchase/inventory/common?tak=' + this.getCondition.tak + '&code=' + this.getCondition.code + '&msg=' + this.getCondition.msg + '&title=' + this.getCondition.title
			})
		},
		
		// 气泡弹窗显示
		library_click(){
			this.value = !this.value
		},
		
		// 复核/取消复核
		Examine(val){
			firstExamine({id: this.getCondition.id,status: val}).then(item => {
				if(item.code == 200){
					if(val == 0){
						uni.showToast({
							title: '已取消复核',
							icon: 'none'
						})
					}	
					if(val == 1){
						uni.showToast({
							title: '复核成功！',
							icon: 'none'
						})
					}
					setTimeout(()=> {
						this.previous_page();
					},1500);
				}
			})
		},
		
		// 监盘/取消监盘
		seExamine(val){
			secondExamine({id: this.getCondition.id,status: val}).then(item => {
				if(item.code == 200){
					if(val == 1){
						uni.showToast({
							title: '已取消监盘',
							icon: 'none'
						})
					}
					if(val == 2){
						uni.showToast({
							title: '监盘成功！',
							icon: 'none'
						})
					}
					setTimeout(()=> {
						this.previous_page();
					},1500)
				}
			})
		},
		
		// 删除
		invenDelete(val){
			inventorydelete(val).then(item=> {
				if(item.code == 200){
					uni.showToast({
						title: '删除成功！'
					})
					setTimeout(()=> {
						this.previous_page();
					},1500)	
				}
			})
		},
		
		// 气泡弹窗结果
		bubble(val){
			if(val.code == 'Inventoryedit'){
				uni.navigateTo({
					url: '/pages/common/index/purchase/inventory/Inventory-edit?id=' + this.getCondition.id + '&tak=' + this.getCondition.tak + '&code=' + this.getCondition.code + '&msg=' + this.getCondition.msg + '&title=' + this.getCondition.title 
				})
			}else if(val.code == 'Inventoryfh'){
				this.Examine(1);
			}else if(val.code == 'Inventoryqxfh'){
				this.Examine(0);
			}else if(val.code == 'Inventoryjp'){
				this.seExamine(2);
			}else if(val.code == 'Inventoryqxjp'){
				this.seExamine(1);
			}else if(val.code == 'Inventorydel'){
				this.invenDelete(this.getCondition.id);
			}
			
		},
		
		// 获取选择列表
		get_list_dataSorce(){
			let dl_code = true;
			if(this.getCondition.code == 0){
				dl_code = false;
			}
			getCondition({actionType: 5,currentId: this.getCondition.id,isLossOrGain: dl_code}).then(item => {
				if(item.code == 200){
					this.dataSorce = item.data;
				}
			})
		}
		
	}
	
}	
	
</script>

<style scoped lang='scss'>
	.library_details {
		width: 100%;
		margin-bottom: 10px;
		div {
			overflow: hidden;
		}
	}
	
	.library_list {
		width: 90%;
		margin: auto;
		background-color: #fff;
		border-radius: 4px;
		padding: 0 0 10px 15px;
		box-shadow: 0 2px 12px 0 rgba(0,0,0,0.1);
		
	}
	
	.library_list_top {
		height: 80rpx;
		line-height: 80rpx;
		width: 95%;
	}
	
	.library_list_nav {
		padding: 0 0 0 15px;
		display: flex;
		overflow: hidden;
		width: 90%;
		div{
			height: 40rpx;
			line-height: 40rpx;
		}
		
		.library_list_left {
			width: 30%;
		}
	}
	
	
	.library_commodity {
		margin-top: 5px;
		padding: 10rpx 0 20rpx 0;
		border-bottom: 1px solid #cacaca;
	}
	
	.library_commodity_center {
		padding: 0 0 0 20rpx;
		display: flex;
	}
	
	
	.library_list_name {
		div{
			height: 80rpx;
			line-height: 80rpx;
		}
		
		.library_list_name_hr {
			width: 95%;
			display: flex;
			justify-content: space-between;
		}
	}
	
	.library_list_name_tow {
		display: flex;
		justify-content: space-between;
		width: 95%;
	}
</style>
